import { DatePicker, Input, InputNumber, Select, Switch } from 'antd';
import { getMessage } from '@inbiz/react';

export enum InputTypeEnum {
  Text = 1,
  Number = 3,
  Date = 4,
  Select = 5,
  Switch = 6,
  CardTmplSelect = 7,
}

export const Option = {
  auth: [
    {
      label: 'add',
      value: 'add',
    },
    {
      label: 'edit',
      value: 'edit',
    },
    {
      label: 'delete',
      value: 'del',
    },
  ],
  paramField: [{ label: 'ID', value: 'id' }],
  position: [
    { label: getMessage('Tree.header'), value: 'tableHeader' },
    { label: getMessage('Tree.hanlinAcademician'), value: 'inline' },
  ],
  openMode: [
    { label: getMessage('Tree.window'), value: 'modal' },
    // { label: '新页面', value: 'page' },
    { label: `${getMessage('Tree.drawer')}-${getMessage('Tree.top')}}`, value: 'top' },
    { label: `${getMessage('Tree.drawer')}-${getMessage('Tree.down')}}`, value: 'bottom' },
    { label: `${getMessage('Tree.drawer')}-${getMessage('Tree.left')}}`, value: 'left' },
    { label: `${getMessage('Tree.drawer')}-${getMessage('Tree.right')}}`, value: 'right' },
  ],
  yesOrNo: [
    { value: '1', label: getMessage('Tree.true') },
    { value: '0', label: getMessage('Tree.false') },
  ],
  fixed: [
    { value: 'left', label: getMessage('Tree.left') },
    { value: 'right', label: getMessage('Tree.right') },
    { value: 'none', label: getMessage('Tree.false') },
  ],
  sorter: [
    { value: 'on', label: getMessage('Tree.open') },
    { value: 'off', label: getMessage('Tree.close') },
  ],
  toolbarDisplayQty: [
    { value: 1, label: `${getMessage('Tree.before')}1${getMessage('Tree.individual')}` },
    { value: 2, label: `${getMessage('Tree.before')}2${getMessage('Tree.individual')}` },
    { value: 3, label: `${getMessage('Tree.before')}3${getMessage('Tree.individual')}` },
    { value: 4, label: `${getMessage('Tree.before')}4${getMessage('Tree.individual')}` },
    { value: 5, label: `${getMessage('Tree.before')}5${getMessage('Tree.individual')}` },
    { value: 6, label: `${getMessage('Tree.before')}6${getMessage('Tree.individual')}` },
    { value: 7, label: `${getMessage('Tree.before')}7${getMessage('Tree.individual')}` },
    { value: 8, label: `${getMessage('Tree.before')}8${getMessage('Tree.individual')}` },
  ],
  actionGroups: [
    { value: 1, label: `${getMessage('Tree.groupName')}1` },
    { value: 2, label: `${getMessage('Tree.groupName')}2` },
    { value: 3, label: `${getMessage('Tree.groupName')}3` },
    { value: 4, label: getMessage('groupingDataComesFromMenuFunctionConfigurationAction') },
  ],
  actionDisplaySetup: [
    { value: 'text', label: getMessage('Tree.writtenWords') },
    { value: 'icon', label: getMessage('Tree.icon') },
    { value: 'iconText', label: `${getMessage('Tree.icon')}+${getMessage('Tree.writtenWords')}` },
  ],
  size: [
    { value: 30, label: 30 },
    { value: 60, label: 60 },
    { value: 90, label: 90 },
  ],
  suffixOfUnit: [
    { value: '%', label: '%' },
    { value: 'px', label: 'px' },
  ],
  pageSize: [
    { value: 10, label: 10 },
    { value: 20, label: 20 },
    { value: 30, label: 30 },
    { value: 50, label: 50 },
    { value: 100, label: 100 },
  ],
  unitOfWidth: [
    { value: 'px', label: getMessage('Tree.pixel') },
    { value: '%', label: getMessage('Tree.percentage') },
  ],
  parentAction: [
    { value: 'add', label: getMessage('Tree.newlyAdded') },
    { value: 'view', label: getMessage('Tree.see') },
    { value: 'edit', label: getMessage('Tree.edit') },
  ],
  actionType: [
    { value: 'save', label: getMessage('Tree.save') },
    { value: 'saveAndNew', label: getMessage('Tree.saveAndCreate') },
    { value: 'pre', label: getMessage('Tree.previous') },
    { value: 'next', label: getMessage('Tree.next') },
    { value: 'cancel', label: getMessage('Tree.cancel') },
    { value: 'custom', label: getMessage('Tree.custom') },
  ],
};

export enum UnitEnum {
  percentage = '%',
  pixel = 'px',
}

export const InputTypeMap: { [key: number]: any } = {
  [InputTypeEnum.Text]: Input,
  [InputTypeEnum.Number]: InputNumber,
  [InputTypeEnum.Date]: DatePicker,
  [InputTypeEnum.Select]: Select,
  [InputTypeEnum.Switch]: Switch,
  // [InputTypeEnum.CardTmplSelect]: CardTmplSelect,
};

const FormConfig = {
  formItems: [
    {
      name: 'width',
      label: 'Tree.windowWidth',
      changeType: (value: string) => {
        return value === 'px' ? InputTypeEnum.Number : InputTypeEnum.Select;
      },
      initInputType: (values: { width: { widthSuffix: string } }) => {
        return values?.width?.widthSuffix === 'px' ? InputTypeEnum.Number : InputTypeEnum.Select;
      },
      children: [
        {
          name: 'widowWidth',
          inputType: InputTypeEnum.Select,
          defaultValue: 30,
          options: Option.size,
          needChangeType: true,
          proportion: '67%',
        },
        {
          name: 'widthSuffix',
          inputType: InputTypeEnum.Select,
          defaultValue: UnitEnum.percentage,
          options: Option.suffixOfUnit,
          proportion: '33%',
        },
      ],
    },
    {
      name: 'height',
      label: 'Tree.windowHeight',
      changeType: (value: string) => {
        return value === 'px' ? InputTypeEnum.Number : InputTypeEnum.Select;
      },
      initInputType: (values: { height: { heightSuffix: string } }) => {
        return values?.height?.heightSuffix === 'px' ? InputTypeEnum.Number : InputTypeEnum.Select;
      },
      children: [
        {
          name: 'windowHeight',
          inputType: InputTypeEnum.Select,
          defaultValue: 30,
          options: Option.size,
          needChangeType: true,
          proportion: '67%',
        },
        {
          name: 'heightSuffix',
          inputType: InputTypeEnum.Select,
          options: Option.suffixOfUnit,
          proportion: '33%',
        },
      ],
    },
  ],
};

export default FormConfig;
